<template>
    <div>

        <el-table
                :data="tableData"
                border
                style="width: 100%">
            <el-table-column
                    type="index"
                    label="序号"
                    width="50">
            </el-table-column>

            <el-table-column
                    prop="id"
                    label="id"
                    width="150">
            </el-table-column>
            <el-table-column
                    prop="createTime"
                    label="创建时间"
                    width="120">
            </el-table-column>
            <el-table-column
                    prop="updateTime"
                    label="更新时间"
                    width="120">
            </el-table-column>
            <el-table-column
                    prop="name"
                    label="姓名"
                    width="120">
            </el-table-column>
            <el-table-column
                    prop="age"
                    label="年龄"
                    width="300">
            </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    width="100">
                <template slot-scope="scope">
                    <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
                    <el-button type="text" size="small">编辑</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
                background
                layout="sizes,prev, pager, next,jumper"
                :page-size=this.pageSize
                :page-sizes="[2, 5, 7, 10, 15]"
                @size-change="handleSizeChange"
                :total=this.total
                @current-change="pageChange"
        >
        </el-pagination>
    </div>
</template>

<script>
    export default {
        methods: {
            handleClick(row) {
                console.log(row);
            },
            pageChange(currentPage){
                console.log(currentPage);
                const _this=this;
                axios.get("http://localhost:8011/eurekaclient/student?pageNum="+currentPage+"&pageSize="+this.pageSize).then(function (resp) {
                    console.log(resp);
                    _this.tableData=resp.data.data;
                    _this.total=resp.data.total;
                })
            },
            handleSizeChange(val) {
                console.log(`每页 ${val} 条`);
                this.pageSize=val;
                this.pageChange(1);
            }
        },
        created(){
            this.pageChange(1);
            if(this.$route.query.testMessage){
                this.$message(this.$route.query.testMessage);
            }
        },
        data() {
            return {
                tableData: [],
                pageSize:5,
                total:0
            }
        }
    }
</script>